<div class="layui-form seller-form"  action="" >
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">资源类型：</label>
            <div class="layui-input-inline seller-inline-3">
                <select name="class" id="class" class="layui-input">
                    <option value=""></option>
                    <option value="1">订单</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">资源ID：</label>
            <div class="layui-input-inline seller-inline-3">
                <input type="text" placeholder="请输入资源ID" name="source_id" id="source_id" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">发票类型：</label>
            <div class="layui-input-inline seller-inline-3">
                <select name="type" id="type" class="layui-input">
                    <option value=""></option>
                    <option value="2">个人发票</option>
                    <option value="3">企业发票</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">发票抬头：</label>
            <div class="layui-input-inline seller-inline-3">
                <input type="text" placeholder="请输入发票抬头" name="title" id="title" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">发票税号：</label>
            <div class="layui-input-inline seller-inline-3">
                <input type="text" placeholder="请输入发票税号" name="tax_number" id="tax_number" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">开票状态：</label>
            <div class="layui-input-inline seller-inline-3">
                <select name="status" id="status" class="layui-input">
                    <option value=""></option>
                    <option value="1">未开票</option>
                    <option value="2">已开票</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <button class="layui-btn layui-btn-sm" lay-submit lay-filter="invoice-search"><i class="iconfont icon-chaxun"></i>筛选</button>
        </div>
    </div>
</div>
<div class="table-body">
    <table id="invoiceTable" lay-filter="invoiceTable"></table>
</div>
<script>
    layui.use(['table','form','laydate'],function(){
        var table = layui.table,form = layui.form,date = layui.laydate;
        table.render({
            elem: '#invoiceTable',
            height: 'full-99',
            cellMinWidth: '80',
            url: "{:url('Invoice/index')}", //数据接口
            id: "invoiceTable",
            page: true ,//开启分页
            limit:'20',
            cols: [[ //表头
                {field:'id', width:90, title:'ID', align: 'center'},
                {field: 'class', title: '资源类型', width: 90, align: 'center'},
                {field: 'source_id', title: '资源ID', width: 150, align: 'center'},
                {field: 'type', title: '发票类型', width: 90, align: 'center'},
                {field: 'title', title: '发票抬头', align: 'center'},
                {field: 'tax_number', title: '发票税号', width: 180, align: 'center'},
                {field: 'amount', title: '发票金额', width: 120, align: 'center'},
                {field: 'status', title: '开票状态', width: 90, align: 'center'},
                {field: 'ctime', title: '创建时间', width: 170, align: 'center'},
                {field: 'right', title:'操作', width: 140, align:'center', toolbar:'#invoice'}
            ]]
        });

        form.on('submit(invoice-search)', function(data){
            layui.table.reload('invoiceTable', {
                where: data.field
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });


        //监听工具条
        table.on('tool(invoiceTable)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象

            if(layEvent === 'del'){ //删除
                layer.confirm('真的要删除吗?', function(index){
                    JsPost("{:url('Invoice/del')}",{id:data.id},function(res){
                        if(res.status){
                            obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                            layer.close(index);//向服务端发送删除指令
                        }
                        layer.msg(res.msg);
                    });
                });
            } else if(layEvent === 'edit'){ //编辑
                JsGet("{:url('Invoice/edit')}?id=" + data.id, function(e){
                    if (e.status) {
                        window.box = layer.open({
                            type: 1,
                            content: e.data,
                            area: setpage(700,430),
                            title: '发票编辑'
                        })
                    }else{
                        layer.msg(e.msg);
                    }
                })
            } else if(layEvent === 'show'){ //编辑
                JsGet("{:url('Invoice/show')}?id=" + data.id, function(e){
                    if (e.status) {
                        window.box = layer.open({
                            type: 1,
                            content: e.data,
                            area: setpage(660,300),
                            title: '发票信息'
                        })
                    }else{
                        layer.msg(e.msg);
                    }
                })
            }
        });

        $(document).on('click', '.invoice-edit-btn', function () {
            var id = $("#invoice_id").val();
            var type = $("#tax_type").val();
            var title = $("#tax_title").val();
            var amount = $("#amount").val();
            var tax_number = $("#edit_tax_number").val();
            var status = $("#tax_status").val();
            var remarks = $("#remarks").val();

            JsPost('{:url("invoice/edit")}', {
                id: id,
                type: type,
                title: title,
                amount: amount,
                tax_number: tax_number,
                status: status,
                remarks: remarks
            }, function(e){
                layer.close(window_box);
                layer.msg(e.msg, { time: 1300 }, function () {
                    table.reload();
                });
            });
        });
    });
</script>
<script type="text/html" id="invoice">
    {{#  if(d.status !== '已开票'){ }}
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    {{#  } }}
    {{#  if(d.status === '已开票'){ }}
    <a class="layui-btn layui-btn-xs" lay-event="show">查看</a>
    {{#  } }}
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>